<template>
  <view class="content-menu">
    <block v-for="(item, index) in menuList" :key="index">
      <view class="content-menu-item">
        <u-image :src="item.src" mode="widthFix" :width="item.width" :height="item.height"/>
        <text>{{ item.name }}</text>
      </view>
    </block>
  </view>
</template>

<script>
export default {
  name: "Menus",
  props: {
    menuList: {
      type: Array,
      default: () => []
    }
  }
}
</script>

<style lang="scss" scoped>
.content-menu {
  width: 100%;
  // margin-top: 40rpx;
  display: flex;
  justify-content: space-around;
  align-items: center;
  &-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 26rpx;
    color: #34343F;
    text {
      
    //   margin-top: 20rpx;
    }
  }
}
</style>